<template>
	<div>
		<homeHeader></homeHeader>
		<headSlider :swiperList="swiperList"></headSlider>
		<homeIcon :iconList="iconList"></homeIcon>
		<homeHot :recommendList="recommendList"></homeHot>
		<homeWeekend :weekendList="weekendList"></homeWeekend>
	</div>	
</template>

<script>
import homeHeader from './header'
import headSlider from './slide'
import homeIcon from './icon'
import homeHot from './hot'
import homeWeekend from './weekend'
import axios from 'axios'//用于ajax
export default {
	name: 'Home',
	components: {
		homeHeader,
		headSlider,
		homeIcon,
		homeHot,
		homeWeekend
	},
	data () {
		return {
      lastCity: '',
			swiperList: [],
			iconList: [],
			recommendList: [],
			weekendList: []
		}
	},
	methods: {
		getInfo (response) {//res  为get请求到的数据
			const res = response.data
			if (res.data && res.ret) {
				this.swiperList = res.data.swiperList
				this.iconList = res.data.iconList
				this.recommendList = res.data.recommendList
				this.weekendList = res.data.weekendList
			}
		}
	},
  mounted () {//外部使用keep-alive 重新进入页面后不会再次执行
    this.lastCity = this.$store.state.city
    // console.log(this.lastCity)
		axios.get('/api/index.json').then(this.getInfo)//webpack中配置proxytable设置代理
  },
  activated () {//判断当前城市与上次城市是否相等，不相等则重新ajax
    if (this.lastCity !== this.$store.state.city) {
      axios.get('/api/index.json?city='+this.$store.state.city).then(this.getInfo)
      this.lastCity = this.$store.state.city
    }
  }
}
</script>